<template>
  <el-select v-model="keys" :placeholder="placeholder">
    <el-option
      v-for="item in keysSelect"
      :key="item.id"
      :label="item.cname"
      :value="item.cname">
    </el-option>
  </el-select>
</template>

<script>
import { columnList } from '@/api/tableInfo'
export default {
  props: ['formId', 'value', 'placeholder'],
  computed: {
    keys: {
      get() {
        return this.value
      },
      set(val) {
        this.$emit('input', val)
      }
    }
  },
  data() {
    return {
      keysSelect: []
    }
  },
  mounted() {
    this.handleGetColuList()
  },
  watch: {
    keys() {
      this.handleGetColuList()
    }
  },
  methods: {
    handleGetColuList() {
      columnList(this.formId).then(res => {
        const { obj } = res
        this.keysSelect = JSON.parse(JSON.stringify(obj))
      })
    }
  }
}
</script>
